<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.5/themes/default/easyui.css"></link>
	<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.5/themes/icon.css"></link>
	<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.5/demo/demo.css"></link>
	<script language="JavaScript"  type="text/javascript" src="js/jquery-easyui-1.5/jquery.min.js"></script>
	<script language="JavaScript"  type="text/javascript" src="js/jquery-easyui-1.5/jquery.easyui.min.js"></script>
<style type="text/css">
	a:link,a:visited{
 		text-decoration:none;  /*超链接无下划线*/
	}
	a:hover{
 		text-decoration:none;  /*鼠标放上去有下划线*/
	}
</style>
	<script type="text/javascript">
	 /*<![CDATA[*/ 
	function showDeskList()
		{
	 		$.get("deskNoGroup", function(data){
				 $("#table").datagrid("loadData", data);
				});
		}
	
	 $(document).ready(  
			  function(){
				
				  $('#deskdlg').dialog('close');
				  
				  $('#dname').textbox('textbox').keydown(function (e) {
				      if (e.keyCode == 13) {
				    	  $('#count').textbox('textbox').focus(); 

				      }
				  });
				  
				  $('#count').textbox('textbox').keydown(function (e) {
				      if (e.keyCode == 13) {
				    	  submitForm1();

				      }
				  });
				    
				  $('#pp1').tooltip({
						position: 'bottom',
						content: '<span style="color:#fff">双餐桌添加至分组</span>',
						onShow: function(){
							$(this).tooltip('tip').css({
								backgroundColor: '#666',
								borderColor: '#666'
							});
						}
					});
				  
				  $('#pp2').tooltip({
						position: 'bottom',
						content: '<span style="color:#fff">双击移除餐桌</span>',
						onShow: function(){
							$(this).tooltip('tip').css({
								backgroundColor: '#666',
								borderColor: '#666'
							});
						}
					});

				  
				  var url = "loadDeskComData";
				  $.get(url, function(data){
					  $('#cc').combobox("loadData", data);
					});
				  
				  showDeskList();
					   
			  });
	 
	   function loadAllandGroup(foodtypeid)
	   {
		   
		   var id = foodtypeid;
	 		var url = "deskList?id="+id;
			$.get(url, function(data){
				 $("#table1").datagrid("loadData", data);
				 $("#size").html(data.length);
				});
	   }
	 
	   function selectfunc(data)
	   {
		   loadAllandGroup(data.value);
		   showDeskList();
	   }
	   
	   function onClickRow(index,rowdata){
		  
		 var  areaid = $('#cc').combobox('getValue');
		 if(areaid.length==0)
		 {
			 alert("请选择分组");
			 return;
		 }
		
		 var url ="adddeskGroup?deskid="+rowdata.id+"&areaid="+areaid;
		 
		 $.ajax(
		 			{
		 	        	url: url,
		 	        	async: false,//改为同步方式
		 	        	type: "GET",
		 	        	success: function (data) {
		 	        		 loadAllandGroup(areaid);
		 	        		 showDeskList();
		 	 			}
		 	 	});
		 
		 
	   }
	
	   function onClickRow2(index,rowdata){
			  
			 var  areaid = $('#cc').combobox('getValue');
			 if(areaid.length==0)
			 {
				 alert("请选择分组");
				 return;
			 }
			 var url ="movedesk?deskid="+rowdata.id+"&areaid="+areaid;
			  $.get(url, function(data1){
				  	
				  loadAllandGroup(areaid);
				  showDeskList();
				   
				});
			 
		   }
	   
	   function opendlg()
		{	 		
	 		$( "#deskdlg" ).dialog({
			      modal: true
			    });
	 		
	 		$.get("get_desknum", function(data){
				$("#idnum").textbox("setValue", data);
				$('#dname').textbox('textbox').focus(); 
				});
	 		
			$('#deskdlg').dialog('open');
						
		}
	   
	   function submitForm1(){
			$.post("add_desk_nogroup",
					$('#ff1').serialize(),
					  function(data){
						$('#deskdlg').dialog('close');
						clearForm1();
						 showDeskList();
					  },
					  "text");
		}
		function clearForm1(){
			var id =$("#areaid").val();
			$('#ff1').form('clear');
		}
		
		function deleteDesk(val)
	    {
	    	$.messager.defaults= { ok: "确定",cancel: "取消" };
	    	 
	    	$.messager.confirm("操作提示","您确定要执行操作吗？",
	    		function (data)
	    	 	{
	    	            if (data)
	    	 			{
	    	            	var url = "delDesk?id="+val;
	    			    	$.get(url, function(data){
	    			    		showDeskList();
	    					});
	    	            }
	    	            
	    	     });
	
	    }
	 	
	   
		function formatColumn(val,row){
	 		var surl ="show_fooddetail?id="+val;
			return '<a href="#"  onclick="deleteDesk(\''+val+'\')">删&nbsp;除</a>'
			
		} 

	 	/*]]>*/  
	</script>
	
	
</head>
<body>


<div id="pp1" style="position:absolute;left:0px;top:0px;height:90%;">
	<table id="table" class="easyui-datagrid" title="未加入分组" style="width:300px;height:100%;" 
			data-options="singleSelect:true,collapsible:false,onDblClickRow: onClickRow,toolbar:'#tt'">
		<thead>
			<tr>
				<th data-options="field:'idnum'" width="20%">桌号</th>
				<th data-options="field:'dname'" width="40%">桌名</th>
				<th data-options="field:'count'" width="20%">人数</th>
				<th data-options="field:'id',formatter:formatColumn" width="20%">操作</th>
			</tr>
		</thead>
	</table>
</div>

<div id="pp2" style="position:absolute;left:300px;top:0px;height:90%;">
	<table id="table1" class="easyui-datagrid" title="已加入分组" style="width:300px;height:100%;"
			data-options="singleSelect:true,collapsible:false,onDblClickRow: onClickRow2,toolbar:'#tb'">
		<thead>
			<tr>
				<th data-options="field:'idnum'" width="20%">桌号</th>
				<th data-options="field:'dname'" width="60%">桌名</th>
				<th data-options="field:'count'" width="20%">人数</th>
			</tr>
		</thead>
	</table>
</div>


	<div id="tb" style="padding:2px 5px;">
		<select class="easyui-combobox" id="cc" data-options="onSelect:selectfunc" panelHeight="auto" style="width:100px">
		</select>
		<span id="size"></span>
		
	</div>
	
	<div id="tt" style="padding:2px 5px;">
		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="opendlg()">新增餐桌</a>
	</div>
	
<div id="deskdlg" class="easyui-dialog" title="新增餐桌"  data-options="iconCls:'icon-save',modal:true" style="width:400pxpx;height:400pxpx">
		<center>
       	 <form id="ff1">
       	    <table>
       	    	<tr>
       	    		<td>桌号：</td>
       	    		<td><input class="easyui-textbox" data-options="readonly:true" name="idnum" id="idnum" style="width:120px"/></td>
       	    	</tr>
       	    	<tr>
       	    		<td>桌名：</td>
       	    		<td><input class="easyui-textbox" name="dname" id="dname" style="width:120px"/></td>
       	    	</tr>
       	    	<tr>
       	    		<td>人数：</td>
       	    		<td><input class="easyui-textbox" name="count" id="count" style="width:120px"/></td>
       	    	</tr>
       	    	
       	    </table>
        	<a href="#" class="easyui-linkbutton" onclick="submitForm1()">新&nbsp;&nbsp;增</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="#" class="easyui-linkbutton" onclick="clearForm1()">重&nbsp;&nbsp;置</a>
         </form>
         </center>
	</div>
	
	
</body>
</html>